{% extends "base.html" %}
{% block title %}欢迎使用Berryfolio{% endblock %}
{% block head %}
	<link type="text/css" href="{{ url_for('static', filename="css/style.css") }}" rel="stylesheet">
{% endblock %}
{% block style %}
<style type="text/css">
    *{ margin:0; padding:0; list-style:none;}
    img{ border:0;}

    .ban{ width:1150px; height:500px; position:relative; overflow:hidden;margin:40px auto 0 auto;}
    .ban2{ width:1150px; height:500px; position:relative; overflow:hidden;}
    .ban2 ul{ position:absolute; left:0; top:0;}
    .ban2 ul li{ width:1150px; height:500px;}
    .prev1{ position:absolute; top:220px; left:20px; width:28px; height:51px;z-index:9;cursor:pointer;}
    .next1{ position:absolute; top:220px; right:20px; width:28px; height:51px;z-index:9;cursor:pointer;}
</style>
{% endblock %}
{% block content %}
    <div class="container" >
		<div class="row">
			<div class="col-md-9">
				<h1 style="margin: 20px 0px 0px 0px; font-family: Special;color: #000000">BERRYFOLIO</h1>
				<h4 style="font-family: time;color: #f8bb9c">上传你的课程作业，加快树莓生长！</h4>
			</div>
			<a id="log_a" style="display: none;" href={{ url_for('login') }}>login</a>
			<a id="reg_a" style="display: none;" href={{ url_for('register') }}>register</a>
			<div class="col-md-2">
				<div class="imgbutton logbutton" style="margin: 15px 0px 0px 90px;" onclick="log_a.click()"></div>
			</div>
			<div class="col-md-1">
				<div class="imgbutton signbutton" style="margin: 15px 0px 0px 0px;" onclick="reg_a.click()"></div>
			</div>
		</div>
	</div>

    <div class="ban" id="demo1">
        <div class="ban2" id="ban_pic1">
            <div class="prev1" id="prev1"><img width="28" height="51" alt="" src={{ url_for('static', filename="images/index_tab_l.png") }}></div>
            <div class="next1" id="next1"><img width="28" height="51" alt="" src={{ url_for('static', filename="images/index_tab_r.png") }}></div>
            <ul>
                <li><img width="1150" height="500" alt="" src={{ url_for('static', filename="images/index1.png") }}></li>
                <li><img width="1150" height="500" alt="" src={{ url_for('static', filename="images/index2.png") }}></li>
                <li><img width="1150" height="500" alt="" src={{ url_for('static', filename="images/index3.png") }}></li>
                <li><img width="1150" height="500" alt="" src={{ url_for('static', filename="images/index4.png") }}></li>
                <li><img width="1150" height="500" alt="" src={{ url_for('static', filename="images/index5.png") }}></li>
            </ul>
        </div>
    </div>
	<br>
	<br>
{% endblock %}
{% block scripts_after_jq %}
    <script src="{{ url_for('static', filename="include/pic_tab.js") }}"></script>
    <script>
        jq('#demo1').banqh({
            box:"#demo1",//总框架
            pic:"#ban_pic1",//大图框架
            pnum:"#ban_num1",//小图框架
            prev_btn:"#prev_btn1",//小图左箭头
            next_btn:"#next_btn1",//小图右箭头
            pop_prev:"#prev2",//弹出框左箭头
            pop_next:"#next2",//弹出框右箭头
            prev:"#prev1",//大图左箭头
            next:"#next1",//大图右箭头
            pop_div:"#demo2",//弹出框框架
            pop_pic:"#ban_pic2",//弹出框图片框架
            pop_xx:".pop_up_xx",//关闭弹出框按钮
            mhc:".mhc",//朦灰层
            autoplay:true,//是否自动播放
            interTime:5000,//图片自动切换间隔
            delayTime:400,//切换一张图片时间
            pop_delayTime:400,//弹出框切换一张图片时间
            order:0,//当前显示的图片（从0开始）
            picdire:true,//大图滚动方向（true为水平方向滚动）
            mindire:true,//小图滚动方向（true为水平方向滚动）
            min_picnum:5,//小图显示数量
            pop_up:true//大图是否有弹出框
        })
    </script>
{% endblock %}
